<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/directory/index.css" />
		<script src="../../js/statistics.js"></script>
		<title></title>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav header">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">企业黄页</h1>
		</header>
		<div class='search clear'>
			<div class="mui-input-row mui-search">
    			<input type="search" class="mui-input-clear input_click" placeholder="请输入您要搜索的企业">	
			</div>
			<span class='s_click ' style='display:none;'>取消</span>
		</div>
    	<!--搜索弹出框-->
		<div class='modal_search' style='display:none;'>
			<!--列表：你的搜索信息-->
			<!--<ul class='mui-table-view' class="search-list">
			</ul>	-->
			
		</div>
		<div class="mui-content">
			<div class='mui-row row_title'>
				<div class='mui-col-xs-4 guide_title guide_1' id="guide_1">
					<li class='title_1'>不限行业</li>
					<img class='img_none' src="../../images/icon/executive_housekeeper/trg.png" alt="" />
				</div>
				<div class='mui-col-xs-4 guide_title guide_2' id="guide_2">
					<i></i>
					<li class='title_2'>不限区域</li>
					<i></i>
					<img class='img_none' src="../../images/icon/executive_housekeeper/trg.png" alt="" />
				</div>
				<div class='mui-col-xs-4 guide_title guide_3' id="guide_3">
					<li class='title_3'>不限资金</li>
					<img class='img_none' src="../../images/icon/executive_housekeeper/trg.png" alt="" />
				</div>
			</div>
		</div>
		<div class="main-body" style="display: none;">
			<div class="modal-cover"></div>
			<div class="money-box box" id="main_3" style="display: none;">
				<ul class='mui-table-view'>
					<li class="no-limit" moneyid="0">不限资金</li>
					<li class='mui-table-view-cell' moneyid="1">250万以下</li>
					<li class='mui-table-view-cell' moneyid="2">250-500万</li>
					<li class='mui-table-view-cell' moneyid="3">500-1000万</li>
					<li class='mui-table-view-cell' moneyid="4">1000万以上</li>
				</ul>
			</div>
		</div>
		<div class="company-body">
			
		</div>
		<script src='../../plugins/jquery/jquery-3.1.0.min.js'></script>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script src="../../js/getApiToken.js"></script>
		<script src='../../plugins/template/template.js'></script>
		<script type="text/javascript" src="../../js/md5.js" ></script>
		<script src='../../plugins/fontset/fontset.js'></script>
		<!--<script type="text/javascript" src="../../js/judge.js" ></script>-->
		<script id="business" type="text/html">
			<div class="business-box box clear" id="main_1" style="display: none;">
				<div class="first-business">
					<ul>
						<li class="no-limit active" pid="0">不限行业</li>
						{{each trade as value i}}
						<li pid="{{value.id}}">
							<p>{{value.title}}</p>
						</li>
						{{/each}}
					</ul>
				</div>
				<div class="second-business">
					<ul sid="0">
						<li tradeid="0">
							<p>不限行业</p>
						</li>
					</ul>
					{{each trade as value i}}
					<ul sid="{{value.id}}" style="display: none;">
						{{each value.second as value i}}
						<li tradeid="{{value.id}}">
							<p>{{value.title}}</p>
						</li>
						{{/each}}
					</ul>
					{{/each}}
				</div>
			</div>
			<div class="area-box box" id="main_2" style="display: none;">
				<ul class='mui-table-view'>
					<li class="no-limit" areaid="0">不限区域</li>
					{{each area as value i}}
					<li class='mui-table-view-cell' areaid="{{value.id}}">{{value.title}}</li>
					{{/each}}
				</ul>
			</div>
		</script>
		<script id="company" type="text/html">
			<div class="title">
				共找到 {{count}} 家企业
			</div>
			<div class="company-list">
				<ul>
					{{each company as value i}}
					<li onclick="openNewWindow({{value.id}})">
						<p>{{value.name}}</p>
						<p>成立时间：{{value.time}}</p>
						<p>法人代表：{{value.legal_person}}</p>
					</li>
					{{/each}}
				</ul>
			</div>
		</script>
		<script id="search-list" type="text/html">
			<ul class='mui-table-view' class="search-list">
				{{each data as value i}}
				<li class='mui-table-view-cell' onclick="openNewWindow({{value.id}})">{{value.name}}</li>
				{{/each}}	
			</ul>
		</script>
		<script>
			mui.init();
			
			mui.plusReady(function(){
				var wait = plus.nativeUI.showWaiting('正在加载中...');
				myAnotherAjax('administration/administration/company','get',{},function(data){
					if(data.success){
						console.log(JSON.stringify(data))
						initData(data);
						setTimeout(function(){
							wait.close();
						},1);
					}else{
						mui.alert("网络错误，请重新尝试");
					}
				});
				var nameProving = /[\u4E00-\u9FA5]*/;
				$(".input_click").keyup(function(){
					var content = $(this).val();
					if(nameProving.test(content) && content.length > 0){
						var wait_2 = plus.nativeUI.showWaiting('正在搜索中...');
						myAnotherAjax('administration/administration/fuzzyQuery','post',{'condition':content},function(data){
							if(data.success){
								if(data.count > 0){
									initList(data);
								}else{
									var html = '<div class="search-none">'+
													'<p>没有查询到“'+content+
													'”的相关内容</p>'+
													'<p>请重新搜索</p>'+
												'</div>';	
									$(".modal_search").html(html);
								}
								setTimeout(function(){
									wait_2.close();
								},1);
							}
						})
					} else if(content.length == 0){
						$(".modal_search").html('');
					}
				});
				
			});
			
			//初始化
			function initData(data){
				var list = {
					company:data.info,
					area:data.area,
					trade:data.trade,
					count:data.count
				};
				var html1 = template('business',list),
					html2 = template('company',list);
				$(".main-body").append(html1);
				$(".company-body").append(html2);
			}
			//搜索内容获得后初始化
			function initList(data){
				var list = {
					data:data.info
				}
				var html = template('search-list',list);
				$(".modal_search").html(html);
			}
			//打开新页面
			function openNewWindow(id){
				mui.openWindow({
					url:'detail.html',
					extras:{
						companyId:id
					}
				})
			}
			//筛选搜索
			function searchFuc(){
				var wait = plus.nativeUI.showWaiting('正在筛选中...');
				var trade_id = $(".title_1").data('trade_id'),
					area_id = $(".title_2").data('area_id'),
					money_id = $(".title_3").data('money_id');
				myAnotherAjax('administration/administration/classQuery','post',{'trade':trade_id,'area':area_id,'money':money_id},function(data){
					if(data.success){
						initSearchList(data);
						setTimeout(function(){
							wait.close();
							$("body").animate({
								scrollTop:0
							},500);
						},1);
					}
				});
			}
			//筛选后数据初始化
			function initSearchList(data){
				var list = {
					company:data.info,
					count:data.count
				};
				var html = template('company',list);
				$(".company-body").html(html);
			}
			
			$(function(){
				//筛选框的切换
				$(".guide_title").on('touchstart',function(e){
					var status = $(".main-body").css("display"),
						className = $(this).find("li").attr('class');
					if(status == 'none' || className.indexOf('click_li') == -1){
						var type = $(this).attr("id");
						type = type.substr(type.length-1,1);
						$(".main-body").show();
						$(this).find("li").addClass("click_li").parent().siblings().find("li").removeClass("click_li");
						$(this).find("img").removeClass("img_none").parent().siblings().find("img").addClass("img_none");
						$(".main-body").find(".box").each(function(){
							var id = $(this).attr("id");
							id = id.substr(id.length-1,1);
							if(type == id){
								$(this).show().siblings(".box").hide();
							}
						})
					}else{
						$(this).find("li").removeClass('click_li');
						$(this).find("img").addClass("img_none");
						$(".main-body").hide();
					}
					e.preventDefault();
				});
				//选中搜索框：弹出搜索
				$('.mui-search').on('touchstart',function(e){
					//强制调起输入法
					var Context = plus.android.importClass("android.content.Context");
		            var InputMethodManager = plus.android.importClass("android.view.inputmethod.InputMethodManager");
		            var main = plus.android.runtimeMainActivity();
		            var imm = main.getSystemService(Context.INPUT_METHOD_SERVICE);
		            imm.toggleSoftInput(0, InputMethodManager.SHOW_FORCED);

					$('.mui-search').addClass('mui-search-click');
					$('.s_click').show();
					$('.modal_search').show();
					$('.input_click').focus();
					$(".main-body").hide();
					$(".mui-content").hide();
					$(".company-body").hide();
					e.preventDefault();
				});
				//点击取消，返回原列表
				$('.s_click').on('touchstart',function(e){
					$('.mui-search').removeClass('mui-search-click');
					$('.modal_search').hide();
					$('.s_click').hide();
					$(".mui-content").show();
					$(".company-body").show();
					//并且输入内容为空
					$('.input_click').val('');
					$('.input_click').focus();
					$('.input_click').blur();
					e.preventDefault();
				});
				//搜索框聚焦时清空
				$('.input_click').on('input',function(){
					var content = $(this).val();
					if(content.length == 0){
						$(".modal_search").html('');
					}
				});
				//搜索框失焦
				$('.input_click').blur(function(e){
					var content = $(this).val();
					if(content.length == 0){
						$('.mui-search').removeClass('mui-search-click');
						$('.modal_search').hide();
						$('.s_click').hide();
						$(".mui-content").show();
						$(".company-body").show();
						$(".modal_search").html('');
						e.preventDefault();
					}
				});
				//点击阴影失焦
				$(".main-body").delegate('.modal-cover','touchstart',function(e){
					$(".main-body").hide();
					$(".guide_title").find("li").removeClass('click_li');
					$(".guide_title").find("img").addClass("img_none");
					e.preventDefault();
				});
				//行业切换
				$(".main-body").delegate('.first-business li','tap',function(e){
					var pid = $(this).attr("pid");
					$(this).addClass("active").siblings().removeClass("active");
					$(".main-body").find('.second-business ul').each(function(){
						var sid = $(this).attr("sid");
						if(pid == sid){
							$(this).show().siblings().hide();
						}
					});
					e.preventDefault();
				});
				//选择行业
				$(".main-body").delegate('.second-business li','touchstart',function(e){
					var trade_id = $(this).attr("tradeid"),
						trade_name = $(this).find("p").text();
					$(".title_1").text(trade_name);
					$(".title_1").data('trade_id',trade_id);
					$(".main-body").hide();
					searchFuc();
					e.preventDefault();
				});
				//选择区域
				$(".main-body").delegate('.area-box li','touchstart',function(e){
					var area_id = $(this).attr("areaid"),
						area_name = $(this).text();
					$(".title_2").text(area_name);
					$(".title_2").data('area_id',area_id);
					$(".main-body").hide();
					searchFuc();
					e.preventDefault();
				});
				//选择资金
				$(".main-body").delegate('.money-box li','touchstart',function(e){
					var money_id = $(this).attr("moneyid"),
						money_name = $(this).text();
					$(".title_3").text(money_name);
					$(".title_3").data('money_id',money_id);
					$(".main-body").hide();
					searchFuc();
					e.preventDefault();
				});
			});
			
		</script>
	</body>
</html>